<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<html>
<head>
    <title>Title</title>
    <script src="${pageContext.request.contextPath}/js/jquery-3.6.0.min.js"></script>
    <script>
        /*使用ajax技术查询商品种类，拼装到 分类导航 下拉框*/
        $(function () {
            setNavber();
        });

        function setNavber() {
            // 发送ajax 获取数据 拼装到下拉菜单上
            let url = "${pageContext.request.contextPath}/categoryServlet"
            let params={
                "method":"findAll",
            }
            let callback = function (rel) {

                $(rel).each(function (index,ele) {
                    let str = "${productVo.cid}" == ele.cid  ? 'selected':''
                    $("#category").append(" <option  value='"+ele.cid+"' "+str+">"+ele.cname+"</option>")
                })

            }
            $.post(url,params,callback,"JSON")
        }
    </script>
</head>
<body>
<!--
            描述：菜单栏
        -->
<div class="container-fluid">
    <div class="col-md-4">
        <img src="${pageContext.request.contextPath}/img/logo2.png"/>
    </div>
    <div class="col-md-5">
        <img src="${pageContext.request.contextPath}/img/header.png"/>
    </div>
    <div class="col-md-3" style="padding-top:20px">
        <ol class="list-inline">
            <%--判断用户是否登录，已登录时显示‘欢迎您：xxx、 注销’--%>
            <c:if test="${not empty loginU}">
                <li>欢迎您: ${loginU.username}</li>
                <li><a href="${pageContext.request.contextPath}/userServlet?method=logout">注销</a></li>

            </c:if>

            <%--未登录时显示‘登录’--%>
                <c:if test="${empty loginU}">
                    <li><a href="${pageContext.request.contextPath}/jsp/login.jsp">登录</a></li>
                </c:if>


            <%--无论是否登录，均展示购物车--%>
            <li><a href="${pageContext.request.contextPath}/jsp/cart.jsp">购物车</a></li>
        </ol>
    </div>
</div>
<!--
    描述：导航条
-->
<div class="container-fluid">
    <nav class="navbar navbar-inverse">
        <div class="container-fluid">
            <!-- Brand and toggle get grouped for better mobile display -->
            <div class="navbar-header">
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
                        data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <%--                <a class="navbar-brand" href="#">首页</a>--%>
            </div>

            <!-- Collect the nav links, forms, and other content for toggling -->
            <div>
                <form action="${pageContext.request.contextPath}/productServlet" method="post">

                    <input type="hidden" name="method" value="findProductByVo">
                    <input type="hidden" name="pageNum" value="1">

                    <span class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                <span>
                    <a style="color: white; font-size: large">分类导航:</a>
                <select name="cid" id="category" style="height: 30px" class="navbar-form">
                    <option value=''>---请选择类别---</option>
                </select>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                </span>
                <span>
                    <a style="color: white; font-size: large">&nbsp;&nbsp;价格区间：&nbsp;</a>
                <input type="text" name="lowPrice" placeholder="请输入最低价" style="height: 32px" id="start"
                       value="${productVo.lowPrice == 0 ?'':productVo.lowPrice }">
                    <a style="color: white; font-size: large">&nbsp;&nbsp;--&nbsp;&nbsp</a>
                <input type="text" name="highPrice" placeholder="请输入最高价" style="height: 32px" id="end"
                       value="${productVo.highPrice == 0 ?'':productVo.highPrice }">
                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <input type="submit" placeholder="提交" style="height: 32px" value="搜索">
                </span>

				</span>
                </form>
            </div>
        </div>
    </nav>
</div>
</body>
</html>
